<template>
  <div class="app-container" v-loading="loading" style="overflow-x: hidden">
    <jimuReportView ref="jimuRefView" :reportID="reportID" type="view"/>
  </div>
  <!-- 审核 -->
  <el-dialog
    :close-on-click-modal="false"
    v-model="dialogForm"
    title="审核报表"
    width="600"
  >
    <el-form
      ref="ruleFormRef"
      style="max-width: 600px"
      :model="ruleForm"
      :rules="rules"
      label-width="auto"
      class="demo-ruleForm"
      :size="formSize"
      status-icon
    >
      <el-form-item label="审核结果" prop="result">
        <el-radio-group v-model="ruleForm.result">
          <el-radio value="1">符合</el-radio>
          <el-radio value="2">补充意见</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="审核意见" prop="remark">
        <el-input v-model="ruleForm.remark" maxlength="200" show-word-limit type="textarea" />
      </el-form-item>
    </el-form>

    <template #footer>
      <div class="dialog-footer">
        <el-button @click="dialogForm = false">取 消</el-button>
        <el-button type="primary" @click="confirmAudit">确 定</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup name="changeShifts">
import { auditReport } from "@/api/productionMgt/taskReport";
import { ref } from "vue";
import { useAttrs, getCurrentInstance, onMounted,reactive } from "vue";
import jimuReportView from "./../../jimureport/view";
import taskDetail from "./../taskCenter/data";

const attrs = useAttrs();
const { proxy } = getCurrentInstance();
const loading = ref(false);
const reportID = ref(114);
const listData = ref();
const emit = defineEmits(["close", "setTitle", "setActions", "setIsActionTop"]);
const actions = ref();
const ruleFormRef = ref()
const dialogForm = ref(false)
const ruleForm = reactive({
    result:'',
    remark:""
})
const validateRemark = (rule, value, callback) => {
  if (value === '' && ruleForm.result == 'opinion') {
    callback(new Error('请填写审核意见'))
  } else {
    callback()
  }
}
const rules = reactive({
    result: [
    {
      required: true,
      message: '请选择审核结果',
      trigger: 'change',
    },
  ],
  remark: [
    {
      validator: validateRemark,
      trigger: 'change',
    },
  ],
})
// function getDetail(id) {
//   loading.value = true;
//   getExecuteList(id).then((res) => {
//     loading.value = false;
//   });
// }
function cancel() {
  emit("close");
}
function audit() {
  ruleForm.remark = ''
  ruleForm.result = ''
  dialogForm.value = true;
}
function confirmAudit(){
    ruleFormRef.value.validate((valid) => {
    if (valid) {
      console.log('submit!')
      const obj = JSON.parse(JSON.stringify(listData.value)) 
      obj.auditResult = ruleForm.result
      obj.auditOpinion = ruleForm.remark
      auditReport(obj).then(res=>{
        console.log(res);
        proxy.$modal.msgSuccess("审核成功");
        emit("close");
      })


    } else {
     console.log('校验失败');
    }
  })
}
//  点击查看任务详情
function goTaskDetail(){
    const row = {
        id:"7",
        showDisabled:'true'
    }
    proxy.subPageNext(taskDetail, { title: "填报详情", data: row, type: "view" }, () => {});
}
onMounted(async () => {
  const { data } = attrs;
  listData.value = data;
  // if (data?.id) {
  //   getDetail(data.id || data.taskRecordId);
  // }
  actions.value = [
    {
      text: "取 消",
      theme: "",
      handle: () => {
        cancel();
      },
    },
    {
      text: "填报详情",
      theme: "",
      handle: () => {
        goTaskDetail();
      },
      loading: false,
    },
    {
      text: "审核",
      theme: "primary",
      handle: () => {
        audit();
      },
      loading: false,
    },
  ];
  emit("setActions", actions.value);
});
</script>
<style lang="scss" scoped></style>
